<!--
 * @Author: wangwenshuai 644586996@qq.com
 * @Date: 2022-11-08 14:01:17
 * @LastEditors: wangwenshuai 644586996@qq.com
 * @LastEditTime: 2022-11-09 11:03:50
 * @FilePath: \CarbonPccountingProject\carbon_accounting_project\src\components\Page\GlobalLayout.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->

<template>
  <div class="box_">
    <a-layout-header>
      <GlobalHeader></GlobalHeader>
    </a-layout-header>
    <a-layout>
      <!-- <SideMenu></SideMenu>  -->
      <a-layout-content>
        <slot></slot>
      </a-layout-content>
    </a-layout>
    <a-layout-footer>
      <GlobalFooter></GlobalFooter>
    </a-layout-footer>
    <ViewReportTool class="download" :fileName="fileName" :fileTemplete="fileTemplete" :exportData="exportData" />
  </div>
</template>

<script>
import bus from "@/bus";
import GlobalHeader from "./GlobalHeader.vue";
import GlobalFooter from "./GlobalFooter.vue";
// import { mapActions, mapState } from "vuex";
import SideMenu from "@/components/Menu/SideMenu.vue";
import ToTop from "@/components/Page/toTop.vue";
import { mixin } from "@/utils/mixin.js";
import ViewReportTool from "@/components/Tools/ViewReport.vue";
export default {
  name: "GlobalLayout",
  mixins: [mixin],
  data() {
    return {
      menus: [],
      fileName: "中国发电企业温室气体排放测试报告",
      fileTemplete: "test",
      exportData: {
        code: "value",
        value1: "41816",
        value2: "41816",
        value3: "43070",
        value4: "42652",
        value5: "45998",
        value6: "38931",
        value7: "12726~17981",
        value8: "52270",
        val1: "",
        val2: "20.08",
        val3: "21.1",
        val4: "18.9",
        val5: "20.2",
        val6: "18.2",
        val7: "",
        val8: "15.32",
        val9: "13.58",
        val10: "12.2",
        key0: "14,607.97",
        key1: "1236.6",
        key2: "3636.17",
        key3: "9735.2",
      },
    };
  },
  components: {
    GlobalHeader,
    GlobalFooter,
    SideMenu,
    ToTop,
    ViewReportTool,
  },
  mounted() {
    // //   console.log(this.menus)
    // this.menus = this.permissionMenuList;
  },
  methods: {},

  // computed: {
  //   ...mapState({
  //     // 主路由
  //     // mainRouters: (state) => state.permission.addRouters,
  //     // 后台菜单
  //     permissionMenuList: (state) => {
  //       return state.user.permissionList;
  //     },
  //   }),
  // },
  destroyed() { },
};
</script>

<style lang="scss" scoped>
.box_ {
  overflow: hidden;
}

.ant-layout-header {
  padding: 0 0px !important;
  height: auto !important;
  z-index: 999;
  line-height: none;
  // height: 50px !important;
  // line-height: auto !important;
  background: #fff !important;
  transition: ease-in 0.2s;
  line-height: normal !important;
}

.ant-layout {
  background-color: transparent !important;
  height: calc(100vh - 121px) !important;
  display: flex !important;
  flex-direction: row !important;
}

.ant-layout-content {
  display: flex;
  flex-direction: row;
  position: relative;
  height: 100%;
  flex: 1;
  z-index: 10;
  background: rgb(176, 196, 223, 1);
  overflow: visible;
}

.ant-layout-content::before {
  background: url("@/assets/img/lightning_blue_background.png") no-repeat;
  height: 200px;
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-position: top left;
  background-size: cover;
}

.ant-layout-content::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -2;
  left: 0;
  right: 0;
  top: 120px;
  width: 100%;
  height: 80px;
  background-image: linear-gradient(to bottom,
      rgba(176, 196, 223, 0),
      rgba(176, 196, 223, 0) 60%,
      rgba(176, 196, 223, 1),
      rgb(238, 244, 255));
}

.ant-layout-footer {
  padding: 0px !important;
  height: 40px !important;
}
</style>